<div class="navbar-custom-menu">
  <ul class="nav navbar-nav">
    <!-- Messages: style can be found in dropdown.less -->
    <li mk-dropdown type="list" [isWrapper]="false" class="notifications-menu">
      <mk-dropdown-toggle>
        <a #toggleElement>
          <i class="fa fa-bell-o"></i>
          <span class="label label-warning" *ngIf="alarms.length>0">{{alarms.length}}</span>
        </a>
      </mk-dropdown-toggle>
      <mk-dropdown-menu>
        <li class="header">{{alarms.length}}条警告</li>
        <li>
          <div class="slimScrollDiv" style="position: relative; overflow: hidden; width: auto; height: 200px;"><ul class="menu" style="overflow: hidden; width: 100%;">
            <li *ngFor="let alarm of alarms;let i = index">
              <a role="button" (click)="remove(i)">
                <i [class]="'fa fa-warning '+(alarm.level==0?'text-yellow':'text-red')"></i>
                报警:{{alarm.device.name}}/{{alarm.device.id}}-{{alarm.date}}
              </a>
            </li>
          </ul><div class="slimScrollBar" style="width: 3px; position: absolute; top: 0; opacity: 0.4; display: block; border-radius: 7px; z-index: 99; right: 1px; background: rgb(0, 0, 0);"></div><div class="slimScrollRail" style="width: 3px; height: 100%; position: absolute; top: 0; display: none; border-radius: 7px; opacity: 0.2; z-index: 90; right: 1px; background: rgb(51, 51, 51);"></div></div>
        </li>
        <li class="footer"><a href="/#/log/alarm">查看全部</a></li>
      </mk-dropdown-menu>
    </li>
    <li class="notifications-menu">
      <a (click)="logout()">
        <i class="fa fa-sign-out"></i>
      </a>
    </li>
  </ul>
</div>
